<template>
	<view class="page-body">
		<navbar title="确认订单"></navbar>
		<view class="address-box fa" @click="pickAddress">
			<image class="location-icon" src="../../static/location3.png" mode="" v-if="takeAddressId"></image>
			<view class="flex1 fa">
				<view class="flex1" v-if="takeAddressId">
					<view class="fa">
						<view class="nickname">{{address.name}}</view>
						<view class="mobile">{{address.phone}}</view>
					</view>
					<view class="address minor">{{address.details}}</view>
				</view>
				<view class="flex1" v-else>
					<view class="nickname no-address">请选择地址</view>
				</view>
				<image class="rightimg" src="../../static/right3.png" mode=""></image>
			</view>
		</view>
		<!-- <view class="info-box">
			<view class="info-list fa jcsb" @click="selectTime">
				<view class="name" style="margin-bottom: 10rpx;">选择上门时间</view>
				<view class="fa" v-if="startTime">
					<view class="red">{{weekList[weekIndex].week}} {{startTime}}~{{endTime}}</view>
				</view>
				<view v-else>请选择上门时间</view>
			</view>
		</view>
		<view class="info-box">
			<view class="goods-box">
				<view class="goods-list flex" v-for="(item, index) in goods" :key="index">
					<image class="goods-img" :src="item.mainImg" mode=""></image>
					<view class="flex1">
						<view class="goods-name ell2">{{item.name}}</view>
						<view class="spec">{{item.skus[0].fullName}}</view>
						<view class="price-box fa jcsb">
							<view class="price fa">
								<view>￥</view>
								<view class="num">{{item.skus[0].price}}</view>
							</view>
							<view class="minor">x{{item.num}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="remark-box fa">
				<view class="left">买家留言</view>
				<input type="text" class="flex1" placeholder="请添加备注（150字以内）" maxlength="150" v-model="memo" />
			</view>
		</view> -->
		<view class="info-box" v-if="goods.length > 0">
			<view class="book-title">预约配送</view>
			<view class="select-box fa jcsb">
				<view>选择上门时间</view>
				<view class="fa" @click="selectTime">
					<view class="red fa" v-if="otherDate && timeIndex > -1">
						<view>{{otherDate}}</view>
						<view class="select-time" v-if="timeIndex > -1">
							<!-- {{weekList[weekIndex].week}} {{startTime}}~{{endTime}} -->
							{{timeList[timeIndex].timeStart}}~{{timeList[timeIndex].timeEnd}}
						</view>
					</view>
					<view v-else>请选择上门时间</view>
				</view>
			</view>
			<view class="goods-box">
				<view class="goods-list flex" v-for="(item, index) in goods" :key="index">
					<image class="goods-img" :src="item.mainImg" mode=""></image>
					<view class="flex1">
						<view class="goods-name ell2">{{item.name}}</view>
						<view class="spec">{{item.skus[0].fullName}}</view>
						<view class="price-box fa jcsb">
							<view class="price fa">
								<view>￥</view>
								<view class="num">{{item.skus[0].price}}</view>
							</view>
							<view class="minor">x{{item.num}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="remark-box fa">
				<view class="left">买家留言</view>
				<input type="text" class="flex1" placeholder="请添加备注（150字以内）" maxlength="150" />
			</view>
		</view>
		<view class="info-box" v-if="goods2.length > 0">
			<view class="book-title">立即配送</view>
			<view class="select-box fa jcsb">
				<view>选择上门时间</view>
				<view class="fa" @click="selectTime2">
					<view class="red fa" v-if="inDate && timeIndex2 > -1">
						<view>{{inDate}}</view>
						<view class="select-time" v-if="timeIndex2 > -1">
							{{timeList2[timeIndex2].timeStart}}~{{timeList2[timeIndex2].timeEnd}}
						</view>
					</view>
					<view v-else>请选择上门时间</view>
				</view>
			</view>
			<view class="goods-box">
				<view class="goods-list flex" v-for="(item, index) in goods2" :key="index">
					<image class="goods-img" :src="item.mainImg" mode=""></image>
					<view class="flex1">
						<view class="goods-name ell2">{{item.name}}</view>
						<view class="spec">{{item.skus[0].fullName}}</view>
						<view class="price-box fa jcsb">
							<view class="price fa">
								<view>￥</view>
								<view class="num">{{item.skus[0].price}}</view>
							</view>
							<view class="minor">x{{item.num}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="remark-box fa">
				<view class="left">买家留言</view>
				<input type="text" class="flex1" placeholder="请添加备注（150字以内）" maxlength="150" />
			</view>
		</view>
		<view class="info-box">
			<view class="info-list fa jcsb" @click="selectCoupon">
				<view class="name">可用优惠券</view>
				<view class="red fa">
					<view>-￥{{couponMoney}}</view>
					<image class="right-icon" src="../../static/right3.png" mode=""></image>
				</view>
			</view>
		</view>
		<view class="info-box">
			<view class="info-list fa jcsb">
				<view class="name">商品金额</view>
				<view class="fa">
					<view>￥{{goodsAmount}}</view>
				</view>
			</view>
		</view>
		<view class="pay-wrapper" v-if="needPay == 1">
			<view class="title">支付方式</view>
			<view class="pay-box">
				<view class="pay-list fa jcsb" @click="payType = 1">
					<view class="fa">
						<image class="pay-icon" src="../../static/balancepay.png" mode=""></image>
						<view>余额支付</view>
					</view>
					<image class="pick-icon" src="../../static/pick-fill.png" mode="" v-if="payType == 1"></image>
					<image class="pick-icon" src="../../static/pick.png" mode="" v-else></image>
				</view>
				<view class="pay-list fa jcsb" @click="payType = 0">
					<view class="fa">
						<image class="pay-icon" src="../../static/wxpay.png" mode=""></image>
						<view>微信支付</view>
					</view>
					<image class="pick-icon" src="../../static/pick-fill.png" mode="" v-if="payType == 0"></image>
					<image class="pick-icon" src="../../static/pick.png" mode="" v-else></image>
				</view>
			</view>
		</view>
		<view class="fixed-bottombar">
			<view class="bottombar-box fa jcsb">
				<view class="amount fa">
					<view>合计：</view>
					<view class="money fa">
						<view class="rmb">￥</view>
						<view>{{totalAmount}}</view>
					</view>
				</view>
				<view class="confirmbtn fa jcc" @click="confirmOrder">提交订单</view>
			</view>
			<view class="fixed-place"></view>
		</view>
		<uni-popup ref="popup" type="bottom" :mask-click="true" border-radius="10px 10px 0 0">
			<view class="coupon-wrapper">
				<view class="coupon-title fa">
					<view>领券</view>
					<image class="close-icon" src="../../static/close.png" mode="" @click="closeCoupon"></image>
				</view>
				<view class="coupon-box fa fdc">
					<scroll-view class="coupon-inner" scroll-y="true">
						<view class="coupon-list fa" v-for="(item, index) in couponList" :key="index">
							<view class="money fa">
								<view class="rmb">¥</view>
								<view>{{item.derate}}</view>
							</view>
							<view class="title-box">
								<view class="full">满{{item.need}}使用</view>
								<view class="time" v-if="item.timer">{{item.timer}}到期</view>
							</view>
							<view class="usebtn" @click="useOneCoupon(item.accountCouponId, item.derate)">立即使用</view>
							<view class="red-paper">新人红包</view>
						</view>
					</scroll-view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="timePop" type="bottom" :safe-area="false" :mask-click="true" border-radius="10px 10px 0 0">
			<view class="time-wrapper">
				<view class="time-title fa jcc">选择时间</view>
				<image class="close-icon" src="../../static/close.png" mode="" @click="timeClose"></image>
				<view class="week-box fa jcsb">
					<view class="week-list fa fdc jcc" :class="{active: weekIndex == index}"
						v-for="(item, index) in weekList" :key="index" @click="dateChange(index)">
						<view class="fz24">{{item.week}}</view>
						<view class="fwb">{{item.date}}</view>
					</view>
				</view>
				<view class="time-box-bg">
					<view class="time-box flex fww">
						<view class="time-list" v-for="(item, index) in timeList" :key="index"
							@click="timeBoxChange(item, index)">
							<view class="time-inner" :class="[{disabled: item.disabled}, {selected: item.selected}]">
								{{item.timeStart}}-{{item.timeEnd}}
							</view>
						</view>
					</view>
					<view class="time-btn" @click="timeConfirm">确定</view>
				</view>
				<!-- <view class="picker-wrapper fa fdc">
					<picker-view :indicator-style="indicatorStyle" :value="value" @change="bindTimeChange"
						class="picker-box">
						<picker-view-column>
							<view class="item" v-for="(item,index) in hours" :key="index">{{item}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item,index) in minutes" :key="index">{{item}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item">至</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item,index) in hours" :key="index">{{item}}</view>
						</picker-view-column>
						<picker-view-column>
							<view class="item" v-for="(item,index) in minutes" :key="index">{{item}}</view>
						</picker-view-column>
					</picker-view>
				</view>
				<view class="time-btn" @click="timeConfirm">确定</view> -->
			</view>
		</uni-popup>
		<uni-popup ref="timePop2" type="bottom" :safe-area="false" :mask-click="true" border-radius="10px 10px 0 0">
			<view class="time-wrapper">
				<view class="time-title fa jcc">选择时间</view>
				<image class="close-icon" src="../../static/close.png" mode="" @click="timeClose2"></image>
				<view class="week-box fa jcsb">
					<view class="week-list fa fdc jcc" :class="{active: weekIndex2 == index}"
						v-for="(item, index) in weekList2" :key="index" @click="dateChange2(index)">
						<view class="fz24">{{item.week}}</view>
						<view class="fwb">{{item.date}}</view>
					</view>
				</view>
				<view class="time-box-bg">
					<view class="time-box flex fww">
						<view class="time-list" v-for="(item, index) in timeList2" :key="index"
							@click="timeBoxChange2(item, index)">
							<view class="time-inner" :class="[{disabled: item.disabled}, {selected: item.selected}]">
								{{item.timeStart}}-{{item.timeEnd}}
							</view>
						</view>
					</view>
					<view class="time-btn" @click="timeConfirm2">确定</view>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import dayjs from '../../common/dayjs.js'
	export default {
		data() {
			const date = new Date()
			const year = date.getFullYear()
			let month = date.getMonth() + 1
			let day = date.getDate()
			const hours = []
			const hour = date.getHours()
			const minutes = []
			const minute = date.getMinutes()
			if (month < 10) {
				month = '0' + month
			}
			if (day < 10) {
				day = '0' + day
			}
			const today = year + '-' + month + '-' + day
			for (let i = 0; i <= 23; i++) {
				// if (i > 8 && i < 21) {
				if (i < 10) {
					hours.push('0' + i + '时')
				} else {
					hours.push(i + '时')
				}

				// }
			}
			for (let i = 0; i <= 59; i++) {
				if (i < 10) {
					minutes.push('0' + i + '分')
				} else {
					minutes.push(i + '分')
				}

			}
			return {
				type: 1, //1直接下单 2购物车下单
				skuId: '',
				ids: '',
				num: '',
				takeAddressId: '', //收货地址ID
				address: {},
				startTime: '', //上门时间
				endTime: '',
				goods: [],
				goods2: [],
				memo: '',
				couponList: [],
				ordersItemVoList: '',
				accountCouponId: '',
				couponMoney: 0,
				couponMoneyWait: 0, //优惠券可用之后显示优惠价格
				goodsAmount: 0,
				totalAmount: 0,
				lock: true,
				payType: 0,
				indicatorStyle: `height: 50px;`,
				year,
				month,
				day,
				today,
				hours,
				hour,
				minutes,
				minute,
				// value: [hour, minute, 0, hour, minute],
				value: [],
				weekList: [],
				weekList2: [],
				weekIndex: 1,
				weekIndex2: 0,
				startTimeBack: '',
				endTimeBack: '',
				startHour: '',
				startMinute: '',
				endHour: '',
				endMinute: '',
				needPay: '', //是否需要支付
				ordersId: '',
				inDate: '',
				otherDate: '', //预约配送的日期
				otherReceivingTime: '', //预约配送的时间
				otherReceivingEndTime: '', //预约配送的时间
				timeList: [{
						timeStart: '08:00',
						timeEnd: '09:00',
						selected: 0,
						disabled: 1
					}, {
						timeStart: '09:00',
						timeEnd: '10:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '10:00',
						timeEnd: '11:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '11:00',
						timeEnd: '12:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '13:00',
						timeEnd: '14:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '14:00',
						timeEnd: '15:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '15:00',
						timeEnd: '16:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '15:00',
						timeEnd: '16:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '16:00',
						timeEnd: '17:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '17:00',
						timeEnd: '18:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '19:00',
						timeEnd: '20:00',
						selected: 0,
						disabled: 0
					}
					// {
					// 	timeStart: '20:00',
					// 	timeEnd: '21:00',
					// 	selected: 0,
					// 	disabled: 0
					// }, {
					// 	timeStart: '21:00',
					// 	timeEnd: '22:00',
					// 	selected: 0,
					// 	disabled: 0
					// },
				],
				timeIndex: -1,
				timeList2: [{
						timeStart: '08:00',
						timeEnd: '09:00',
						selected: 0,
						disabled: 1
					}, {
						timeStart: '09:00',
						timeEnd: '10:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '10:00',
						timeEnd: '11:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '11:00',
						timeEnd: '12:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '13:00',
						timeEnd: '14:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '14:00',
						timeEnd: '15:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '15:00',
						timeEnd: '16:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '15:00',
						timeEnd: '16:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '16:00',
						timeEnd: '17:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '17:00',
						timeEnd: '18:00',
						selected: 0,
						disabled: 0
					}, {
						timeStart: '19:00',
						timeEnd: '20:00',
						selected: 0,
						disabled: 0
					}
					// , {
					// 	timeStart: '20:00',
					// 	timeEnd: '21:00',
					// 	selected: 0,
					// 	disabled: 0
					// }, {
					// 	timeStart: '21:00',
					// 	timeEnd: '22:00',
					// 	selected: 0,
					// 	disabled: 0
					// },
				],
				timeIndex2: -1,
			};
		},
		onLoad(options) {
			this.timeContent()
			this.getAddress()
			if (options.skuId) {
				this.skuId = options.skuId
				this.num = options.num
				this.getInfo()
				this.getCoupon()
				this.getPrice()
			}
			if (options.data) {
				const data = JSON.parse(decodeURIComponent(options.data));
				this.type = data.type
				this.ids = data.ids
				this.getInfo()
				this.getCoupon()
				this.getPrice()
			}
			uni.$on("selectAddress", e => {
				this.takeAddressId = e.accountAddressId
				this.address = e
			})
			this.$nextTick(() => {
				this.value = [this.hour, this.minute, 0, this.hour, this.minute]
			})
			this.startHour = this.hour
			this.startMinute = this.minute
			this.endHour = this.hour
			this.endMinute = this.minute
			this.startTimeBack = this.startHour + ':' + this.startMinute
			this.endTimeBack = this.endHour + ':' + this.endMinute
			this.getWeekList()
			this.getTimeList()
		},
		onUnload: function() {
			uni.$off("selectAddress")
		},
		methods: {
			timeContent() {
				this.api.timeListContent().then(res => {
					this.timeList = res.data
					this.timeList2 = res.data
					// 处理时间禁用状态
					this.processTimeDisabled()
					console.log(res);
				})
			},
			getAddress() {
				this.api.addressListFunc({
					isDefault: 1
				}).then(res => {
					console.log(res);
				})
			},
			// 获取今天明天这几天
			getWeekList() {
				let weeks = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
				for (let i = 0; i < 7; i++) {
					let item = {
						date: '',
						week: ''
					}
					item.date = dayjs().add(i, 'day').format('MM-DD');
					if (i == 0) {
						item.week = '今天'
					} else if (i == 1) {
						item.week = '明天'
					} else {
						let week = dayjs(item.date).day();
						item.week = weeks[week];
					}
					this.weekList.push(item)
					this.weekList2.push(item)
				}
				this.today = this.year + '-' + this.weekList[this.weekIndex].date
			},
			getTimeList() {
				// 使用后台返回的数据判断时间是否过期，不再使用前端时间判断
				// 后台已经在 timeContent() 方法中返回了正确的时间列表数据
				// timeList 和 timeList2 已经包含了正确的 disabled 状态
			},
			// 处理时间禁用状态
			processTimeDisabled() {
				const now = new Date()
				const currentHour = now.getHours()
				const currentMinute = now.getMinutes()
				const currentTime = currentHour * 60 + currentMinute // 转换为分钟数
				
				// 处理预约配送时间列表（预约配送只能选择明天及以后，所以所有时间段都可用）
				this.timeList.forEach((item, index) => {
					// 预约配送选择的是明天及以后的日期，所有时间段都可用
					item.disabled = 0
				})
				
				// 处理立即配送时间列表（立即配送可以选择今天，需要判断当前时间）
				this.timeList2.forEach((item, index) => {
					// 如果选择的是今天，需要判断时间是否过期
					if (this.weekIndex2 === 0) { // 今天
						const [startHour, startMinute] = item.timeStart.split(':').map(Number)
						const startTime = startHour * 60 + startMinute
						
						// 如果当前时间已经超过了这个时间段的开始时间，则禁用
						if (currentTime >= startTime) {
							item.disabled = 1
						} else {
							item.disabled = 0
						}
					} else {
						// 选择的是明天及以后，所有时间段都可用
						item.disabled = 0
					}
				})
			},
			selectTime() {
				this.$refs.timePop.open()
			},
			// 关闭时间弹窗
			timeClose() {
				this.$refs.timePop.close()
			},
			selectTime2() {
				this.$refs.timePop2.open()
			},
			// 关闭时间弹窗
			timeClose2() {
				this.$refs.timePop2.close()

			},
			// 选择周几，不可选今天，最早明天送
			dateChange(index) {
				if (index > 0) {
					this.weekIndex = index
					this.otherDate = this.year + '-' + this.weekList[this.weekIndex].date
					// 重新处理时间禁用状态
					this.processTimeDisabled()
				}
			},
			// 选择周几，立即配送可以选今天
			dateChange2(index) {
				this.weekIndex2 = index
				this.inDate = this.year + '-' + this.weekList2[this.weekIndex2].date
				// 重新处理时间禁用状态
				this.processTimeDisabled()
			},
			// 预约配送 选择时间
			timeBoxChange(item, index) {
				for (let i = 0; i < this.timeList.length; i++) {
					if (this.timeList[index].disabled) return false
					this.timeList[i].selected = 0
					if (i == index) {
						this.timeList[index].selected = 1
						this.timeIndex = i
					}
				}
			},
			// 立即配送 选择时间
			timeBoxChange2(item, index) {
				for (let i = 0; i < this.timeList2.length; i++) {
					if (this.timeList2[index].disabled) return false
					this.timeList2[i].selected = 0
					if (i == index) {
						this.timeList2[index].selected = 1
						this.timeIndex2 = i
					}
				}
			},
			// picker-view选择时间
			bindTimeChange(e) {
				let timeDetail = e.detail.value
				this.startHour = timeDetail[0]
				this.startMinute = timeDetail[1]
				this.endHour = timeDetail[3]
				this.endMinute = timeDetail[4]
				if (this.startHour < 10) {
					this.startHour = '0' + this.startHour
				}
				if (this.startMinute < 10) {
					this.startMinute = '0' + this.startMinute
				}
				if (this.endHour < 10) {
					this.endHour = '0' + this.endHour
				}
				if (this.endMinute < 10) {
					this.endMinute = '0' + this.endMinute
				}
				this.startTimeBack = this.startHour + ':' + this.startMinute
				this.endTimeBack = this.endHour + ':' + this.endMinute
			},
			// 选择时间弹窗点击确认
			timeConfirm() {
				if (this.startHour > this.endHour) {
					uni.showToast({
						title: '请选择正确的时间',
						icon: 'none'
					})
				} else if (this.startHour == this.endHour && this.startMinute > this.endMinute) {
					uni.showToast({
						title: '请选择正确的时间',
						icon: 'none'
					})
				} else {
					this.startTime = this.startTimeBack
					this.endTime = this.endTimeBack
					// 设置预约配送的时间索引，用于显示时间
					// this.timeIndex = 0
				}
				this.$refs.timePop.close()
				if (!this.otherDate) {
					this.otherDate = this.year + '-' + this.weekList[this.weekIndex].date
				}
			},
			// 立即配送选择上门时间点击确定
			timeConfirm2() {
				this.$refs.timePop2.close()
				if (this.startHour > this.endHour) {
					uni.showToast({
						title: '请选择正确的时间',
						icon: 'none'
					})
				} else if (this.startHour == this.endHour && this.startMinute > this.endMinute) {
					uni.showToast({
						title: '请选择正确的时间',
						icon: 'none'
					})
				} else {

					this.startTime = this.startTimeBack
					this.endTime = this.endTimeBack
				}
				// 设置立即配送的日期，如果没有选择日期则设置为今天
				if (!this.inDate) {
					this.inDate = this.year + '-' + this.weekList2[this.weekIndex2].date
				}
			},
			getInfo() {
				let params = {}
				if (this.type == 1) {
					params.skuId = this.skuId
					params.num = this.num
				} else if (this.type == 2) {
					params.shoppingIds = this.ids
				}
				this.api.confirmInfoFunc(params).then(res => {
					if (res.code == 200) {
						// this.goods = res.data
						// goods是预约配送，有可能没有预约配送，goods2是立即配送
						console.log(res.data.otherTime)
						if (res.data.otherTime.length > 0) {
							this.goods = res.data.otherTime
						}
						if (res.data.inTime.length > 0) {
							this.goods2 = res.data.inTime
						}
					}
				})
			},
			getCoupon() {
				this.api.myCouponFunc({
					state: 0
				}).then(res => {
					if (res.code == 200) {
						this.couponList = res.data
					}
				})
			},
			getPrice() {
				let params = {}
				params.type = 0
				params.accountCouponId = this.accountCouponId
				if (this.type == 1) {
					params.skuId = this.skuId
					params.num = this.num
				} else if (this.type == 2) {
					params.shoppingIds = this.ids
				}
				this.api.confirmPriceFunc(params).then(res => {
					if (res.code == 200) {
						if (res.data.address != null) {
							this.address = res.data.address
							this.takeAddressId = res.data.address.accountAddressId
						}
						if (res.data.derate != null && res.data.derate != '') {
							this.couponMoney = res.data.derate
						} else {
							this.couponMoney = this.couponMoneyWait
						}

						this.goodsAmount = res.data.origin
						this.totalAmount = res.data.all
						this.needPay = res.data.needPay
						this.accountCouponId = res.data.accountCouponId
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
						setTimeout(() => {
							uni.navigateBack()
						}, 500)
					}
				})
			},
			// 选择地址
			pickAddress() {
				uni.navigateTo({
					url: '/pages/mine/address' + '?type=2'
				})
			},
			selectCoupon() {
				if (this.couponList.length > 0) {
					this.$refs.popup.open()
				} else {
					uni.showToast({
						title: '暂无可用优惠券',
						icon: 'none'
					})
				}
			},
			closeCoupon() {
				this.$refs.popup.close()
			},
			useOneCoupon(id, money) {
				this.accountCouponId = id
				this.couponMoneyWait = money
				this.$refs.popup.close()
				this.getPrice()
			},
			confirmOrder() {
				if (!this.takeAddressId) return uni.showToast({
					title: '请选择地址',
					icon: 'none'
				})
				// if (!this.startTime || !this.endTime) return uni.showToast({
				// 	title: '请选择上门时间',
				// 	icon: 'none'
				// })
				if (this.goods.length > 0 && (!this.otherDate || this.timeIndex == -1)) return uni.showToast({
					title: '请选择预约配送上门时间',
					icon: 'none'
				})
				if (this.goods2.length > 0 && (!this.inDate || this.timeIndex2 == -1)) return uni.showToast({
					title: '请选择立即配送上门时间',
					icon: 'none'
				})
				if (this.utils.transTimeStemp(this.startTime) > this.utils.transTimeStemp(this.endTime)) return uni
					.showToast({
						title: '请选择正确的时间',
						icon: 'none'
					})
				if (!this.lock) return false
				this.lock = false
				uni.showLoading({
					title: '加载中'
				})
				// 如果已经提交过一次订单
				if (this.ordersId) {
					if (this.needPay == 1) {
						this.api.miniAppPayFunc({
							payType: this.payType,
							ordersNo: this.ordersId
						}).then(res => {
							uni.hideLoading()
							if (res.code == 200) {
								// 商品支付：有的商品需要先支付再配送（易存储），有的商品需要先配送再支付（生鲜类）
								// 1是余额支付
								if (this.payType) {
									uni.showToast({
										title: '支付成功'
									})
									setTimeout(() => {
										uni.redirectTo({
											url: '/pages/cate/confirm_success'
										})
									}, 1500)
								} else {
									uni.requestPayment({
										provider: 'wxpay',
										nonceStr: res.data.nonceStr,
										package: res.data.package,
										paySign: res.data.paySign,
										signType: res.data.signType,
										timeStamp: res.data.timeStamp,
										success: res2 => {
											uni.showToast({
												title: '支付成功'
											})
											setTimeout(() => {
												uni.redirectTo({
													url: '/pages/cate/confirm_success'
												})
											}, 1500)
										},
										fail: err => {
											this.lock = true
										}
									})
								}
							} else {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								})
								this.lock = true
							}
						}).catch(err => {
							uni.hideLoading()
							uni.showToast({
								title: '操作失败',
								icon: 'none'
							})
							this.lock = true
						})
					} else {
						uni.showToast({
							title: res.msg
						})
						setTimeout(() => {
							uni.redirectTo({
								url: '/pages/cate/confirm_success'
							})
						}, 1500)
					}
				} else {
					// console.log(this.timeList[this.timeIndex].timeStart)
					let params = {
						type: 0,
						takeAddressId: this.takeAddressId,
						day: this.weekList[this.weekIndex].date,
						// receivingTime: this.startTime,
						// receivingEndTime: this.endTime,
						// receivingTime: this.timeList2[this.timeIndex2].timeStart,
						// receivingEndTime: this.timeList2[this.timeIndex2].timeEnd,
						// otherDay: this.otherDate,
						// otherReceivingTime: this.timeList[this.timeIndex].timeStart,
						// otherReceivingEndTime: this.timeList[this.timeIndex].timeEnd,
						accountCouponId: this.accountCouponId,
						originMoney: this.goodsAmount,
						money: this.totalAmount,
						needPay: this.needPay,
						memo: this.memo
					}
					if (this.type == 1) {
						params.skuId = this.skuId
						params.num = this.num
					} else if (this.type == 2) {
						params.shoppingIds = this.ids
					}
					if (this.goods.length > 0) {
						params.otherDay = this.otherDate
						params.otherReceivingTime = this.timeList[this.timeIndex].timeStart
						params.otherReceivingEndTime = this.timeList[this.timeIndex].timeEnd
						// params.otherReceivingTime = this.startTime
						// params.otherReceivingEndTime = this.endTime
					}
					if (this.goods2.length > 0) {
						// params.otherDay = this.otherDate
						params.receivingTime = this.timeList2[this.timeIndex2].timeStart
						params.receivingEndTime = this.timeList2[this.timeIndex2].timeEnd
					}
					this.api.confirmOrderFunc(params).then(res => {
						if (res.code == 200) {
							this.ordersId = res.data
							if (res.msg) {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								})
								setTimeout(() => {
									if (this.needPay == 1) {
										this.api.miniAppPayFunc({
											payType: this.payType,
											ordersNo: res.data
										}).then(res => {
											uni.hideLoading()
											if (res.code == 200) {
												// 商品支付：有的商品需要先支付再配送（易存储），有的商品需要先配送再支付（生鲜类）
												// 1是余额支付
												if (this.payType) {
													uni.showToast({
														title: '支付成功'
													})
													setTimeout(() => {
														uni.redirectTo({
															url: '/pages/cate/confirm_success'
														})
													}, 1500)
												} else {
													uni.requestPayment({
														provider: 'wxpay',
														nonceStr: res.data.nonceStr,
														package: res.data.package,
														paySign: res.data.paySign,
														signType: res.data.signType,
														timeStamp: res.data.timeStamp,
														success: res2 => {
															uni.showToast({
																title: '支付成功'
															})
															setTimeout(() => {
																uni.redirectTo({
																	url: '/pages/cate/confirm_success'
																})
															}, 1500)
														},
														fail: err => {
															this.lock = true
														}
													})
												}
											} else {
												uni.showToast({
													title: res.msg,
													icon: 'none'
												})
												this.lock = true
											}
										}).catch(err => {
											uni.hideLoading()
											uni.showToast({
												title: '操作失败',
												icon: 'none'
											})
											this.lock = true
										})
									} else {
										uni.hideLoading()
										// uni.showToast({
										// 	title: res.msg
										// })
										setTimeout(() => {
											uni.redirectTo({
												url: '/pages/cate/confirm_success'
											})
										}, 1500)
									}
								}, 1500)
							} else {
								if (this.needPay == 1) {
									this.api.miniAppPayFunc({
										payType: this.payType,
										ordersNo: res.data
									}).then(res => {
										uni.hideLoading()
										if (res.code == 200) {
											// 商品支付：有的商品需要先支付再配送（易存储），有的商品需要先配送再支付（生鲜类）
											// 1是余额支付
											if (this.payType) {
												uni.showToast({
													title: '支付成功'
												})
												setTimeout(() => {
													uni.redirectTo({
														url: '/pages/cate/confirm_success'
													})
												}, 1500)
											} else {
												uni.requestPayment({
													provider: 'wxpay',
													nonceStr: res.data.nonceStr,
													package: res.data.package,
													paySign: res.data.paySign,
													signType: res.data.signType,
													timeStamp: res.data.timeStamp,
													success: res2 => {
														uni.showToast({
															title: '支付成功'
														})
														setTimeout(() => {
															uni.redirectTo({
																url: '/pages/cate/confirm_success'
															})
														}, 1500)
													},
													fail: err => {
														this.lock = true
													}
												})
											}
										} else {
											uni.showToast({
												title: res.msg,
												icon: 'none'
											})
											this.lock = true
										}
									}).catch(err => {
										uni.hideLoading()
										uni.showToast({
											title: '操作失败',
											icon: 'none'
										})
										this.lock = true
									})
								} else {
									uni.hideLoading()
									uni.showToast({
										title: res.msg
									})
									setTimeout(() => {
										uni.redirectTo({
											url: '/pages/cate/confirm_success'
										})
									}, 1500)
								}
							}
						} else {
							uni.hideLoading()
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
							this.lock = true
						}
					}).catch(err => {
						uni.hideLoading()
						uni.showToast({
							title: '提交失败',
							icon: 'none'
						})
						this.lock = true
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.address-box {
		margin: 16rpx 24rpx 0;
		padding: 30rpx 20rpx;
		border-radius: 16rpx;
		background-color: #fff;

		.location-icon {
			margin-right: 28rpx;
			width: 80rpx;
			height: 80rpx;
		}

		.nickname {
			font-size: 26rpx;
			font-weight: bold;
		}

		.mobile {
			margin-left: 10rpx;
			font-size: 26rpx;
			font-weight: bold;
		}

		.address {
			margin-top: 10rpx;
		}

		.rightimg {
			width: 36rpx;
			height: 36rpx;
		}

		.no-address {
			padding: 20rpx;
		}
	}

	.info-box {
		margin: 20rpx 24rpx 0;
		padding: 2rpx 0 40rpx;
		border-radius: 16rpx;
		font-size: 26rpx;
		background-color: #fff;

		.info-list {
			margin: 38rpx 20rpx 0;

			.red {
				color: #FE3134;
			}

			.right-icon {
				margin-left: 10rpx;
				width: 28rpx;
				height: 28rpx;
			}
		}

		.remark-box {
			margin: 30rpx 16rpx 0;

			.left {
				margin-right: 20rpx;
			}
		}

		.book-title {
			position: relative;
			margin: 30rpx 16rpx 0;
			padding-left: 20rpx;
			font-size: 30rpx;
			font-weight: bold;

			&::after {
				content: '';
				position: absolute;
				left: 0;
				top: 50%;
				transform: translateY(-50%);
				width: 8rpx;
				height: 30rpx;
				border-radius: 4rpx;
				background: linear-gradient(270deg, #6CE083 0%, #3DBF63 100%);
			}
		}

		.select-box {
			margin: 30rpx 16rpx 0;

			.red {
				color: #FE3134;
			}

			.select-time {
				margin-left: 10rpx;
			}
		}
	}

	.goods-box {
		// margin-top: 30rpx;
		padding: 2rpx 16rpx 0;

		// border-top: 2rpx solid var(--border);
		.goods-list {
			margin-top: 24rpx;

			.goods-img {
				margin-right: 16rpx;
				width: 180rpx;
				height: 180rpx;
				border-radius: 8rpx;
			}

			.goods-name {
				width: 460rpx;
			}

			.spec {
				font-size: 24rpx;
				color: #777;
				line-height: 40rpx;
			}

			.price-box {
				margin-top: 20rpx;

				.price {
					color: #FE3134;
					font-weight: bold;

					.num {
						font-size: 32rpx;
					}
				}
			}
		}
	}

	.pay-wrapper {
		margin: 20rpx 24rpx 0;
		padding: 20rpx;
		border-radius: 16rpx;
		font-size: 26rpx;
		background-color: #fff;

		.pay-box {
			padding-top: 6rpx;

			.pay-list {
				margin-top: 36rpx;

				.pay-icon {
					margin-right: 20rpx;
					width: 48rpx;
					height: 48rpx;
				}

				.pick-icon {
					width: 36rpx;
					height: 36rpx;
				}
			}
		}
	}

	.fixed-bottombar {
		.bottombar-box {
			z-index: 88;
			position: fixed;
			bottom: 0;
			bottom: env(safe-area-inset-bottom);
			left: 0;
			right: 0;
			padding: 0 24rpx;
			height: 100rpx;
			background-color: #fff;
			box-shadow: inset 0 2rpx 0 0 #E6E6E6;

			.amount {
				.money {
					font-size: 30rpx;
					font-weight: bold;
					color: #FE2525;

					.rmb {
						font-size: 24rpx;
					}
				}
			}

			.confirmbtn {
				width: 230rpx;
				height: 68rpx;
				border-radius: 34rpx;
				color: #fff;
				background: linear-gradient(270deg, #6CE083 0%, #3DBF63 100%);
			}
		}

		.fixed-place {
			height: 100rpx;
		}
	}

	.coupon-wrapper {
		padding-top: 2rpx;
		border-radius: 20rpx 20rpx 0 0;
		background-color: #fff;

		.coupon-title {
			position: relative;
			padding: 0 24rpx;
			height: 100rpx;
			font-size: 32rpx;
			font-weight: bold;

			.close-icon {
				position: absolute;
				right: 24rpx;
				top: 50%;
				transform: translateY(-50%);
				width: 24rpx;
				height: 24rpx;
			}
		}

		.coupon-box {
			padding-bottom: 24rpx;
			height: 700rpx;
			overflow: hidden;

			.coupon-inner {
				height: 700rpx;
			}

			.coupon-list {
				position: relative;
				margin: 24rpx 24rpx 0;
				padding: 0 32rpx 0 48rpx;
				height: 180rpx;
				border-radius: 20rpx;
				color: #FE3134;
				background-color: #FFF7E3;

				&.grey {
					filter: grayscale(1);
				}

				.money {
					flex-basis: 30%;
					font-size: 58rpx;
					font-weight: bold;
					color: #FF2F2F;

					.rmb {
						font-size: 38rpx;
					}
				}

				.title-box {
					padding: 0 10rpx;
					flex-basis: 46%;

					.full {
						font-size: 32rpx;
						font-weight: bold;
					}

					.time {
						margin-top: 8rpx;
						font-size: 20rpx;
					}
				}

				.usebtn {
					position: relative;
					padding-left: 10rpx;
					flex-basis: 24%;
					text-align: right;
					font-size: 32rpx;
					font-weight: bold;

					&::after {
						content: '';
						position: absolute;
						left: 0;
						top: 50%;
						transform: translateY(-50%);
						width: 2rpx;
						height: 84rpx;
						border-left: 2rpx dashed #DC4A37;
					}
				}

				.red-paper {
					position: absolute;
					top: 0;
					left: 0;
					padding: 0 16rpx;
					border-radius: 20rpx 0 20rpx 0;
					height: 36rpx;
					line-height: 36rpx;
					font-size: 22rpx;
					color: #fff;
					background: linear-gradient(85deg, #FE5224 0%, #FD8B24 100%);
				}
			}
		}

		.receive-btn {
			margin-top: 100rpx;
			width: 556rpx;
			height: 88rpx;
			border-radius: 44rpx;
			font-size: 32rpx;
			color: #fff;
			background: linear-gradient(180deg, #EF743D 0%, #DE3920 100%);
		}
	}

	.time-wrapper {
		position: relative;
		padding-bottom: 100rpx;
		border-radius: 20rpx 20rpx 0 0;
		background-color: #fff;

		.time-title {
			padding: 42rpx 0 28rpx;
			font-size: 34rpx;
			font-weight: bold;
		}

		.close-icon {
			position: absolute;
			top: 42rpx;
			right: 26rpx;
			width: 36rpx;
			height: 36rpx;
		}

		.week-box {
			padding: 28rpx;

			.week-list {
				width: 112rpx;
				height: 112rpx;
				border-radius: 24rpx;

				&.active {
					color: #fff;
					background-color: #18C954;
				}
			}
		}

		.time-box-bg {
			background-color: var(--bodybg);
		}

		.time-box {
			padding: 2rpx 20rpx 20rpx;
			margin-left: -8rpx;
			margin-right: -8rpx;

			.time-list {
				margin-top: 20rpx;
				padding: 0 8rpx;
				flex-basis: 33.33%;
				height: 80rpx;
				box-sizing: border-box;

				.time-inner {
					height: 80rpx;
					line-height: 80rpx;
					border-radius: 10rpx;
					border: 2rpx solid #fff;
					text-align: center;
					font-size: 24rpx;
					background-color: #fff;
					box-sizing: border-box;

					&.disabled {
						color: #999;
					}

					&.selected {
						border: 2rpx solid var(--theme);
						color: var(--theme);
					}
				}
			}
		}

		.picker-box {
			margin-top: 20rpx;
			width: 650rpx;
			height: 500rpx;

			.item {
				line-height: 100rpx;
				text-align: center;
			}
		}

		.time-btn {
			margin: 48rpx 24rpx 0;
			margin-top: 200rpx;
			height: 88rpx;
			line-height: 88rpx;
			border-radius: 44rpx;
			text-align: center;
			font-size: 34rpx;
			color: #fff;
			background: linear-gradient(270deg, #6CE083 0%, #3DBF63 100%);
		}
	}
</style>